<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<link rel="stylesheet" type="text/css" href="css/teacherQuery.css"/>
	<body>
		<div id="teacherQuery">
			<div class="teachHeader">
				<div class="login">
					<img src="img/Logo.png" >
				</div>
				<input type="text" class="search" placeholder="搜索"/>
				<div id="search-icon">
					<img src="img/搜索.png" >
				</div>
				<div id="user" @click="showUserLi">
					<img src="img/YY_user_3.png" >
				</div>
			</div>
			<div id="ul" v-show="userLi">
				<ul>
					<li><span class="li-icon li-icon1"><img src="img/信封.png" ></span>消息中心</li>
					<li><span class="li-icon li-icon2"><img src="img/退出.png" ></span>退出登录</li>
					<li @click="showPermission"><span class="li-icon li-icon3"><img src="img/设置.png" ></span>设置</li>
				</ul>
			</div>
			<div class="permission" v-show="permission">
				<ul>
					<li @click ="managerLogin"><span class="li-icon li-icon1"></span>用户权限</li>
					<li><span class="li-icon li-icon1"></span>修改密码</li>
				</ul>
			</div>
			<div id="studentInfo" class="main-left" @click="goSearchInformation">
				<h2>查询学生信息</h2>
				<img src="img/tbanner1.png" class="main-banner">
			</div>
			<div id="teacherInfo" class="main-right" v-show="manager" @click="goUserManagement">
				<h2>管理账户</h2>
				<img src="img/tbanner2.png" class="main-banner">
			</div>
			<div class="tIcon1 tIcon">
				<img src="img/tIcon1.png" >
			</div>
			<div class="tIcon2 tIcon">
				<img src="img/tIcon2.png" >
			</div>
		</div>
		
	</body>
	<script src="js/vue%20.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/teacQuery.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		new Vue({
			el:'#teacherQuery',
			data:{
				userLi: false,
				permission: false,
				manager: true
			},
			methods:{
				showUserLi(){
					this.userLi = ! this.userLi;
				},
				showPermission(){
					this.permission = ! this.permission;
				},
				managerLogin(){
					window.location.replace("./managerLogin.html");
					// this.manager = ! this.manager;
				},
				goSearchInformation(){
					// window.location.replace("./searchInformation.html");
					window.location = "./searchInformation.html";
				},
				goUserManagement(){
					// window.location.replace("./userManagement.html");
					window.location = "./userManagement.html";
				},
				setUp(){
							 let url = "";
							 let xhr = new XMLHttpRequest();
							 xhr.open('get',url,true);
							 xhr.onreadystatechange = () => {
								 if (xhr.readyState ===4 || xhr.status === 200){
									 console.log(JSON.parse(xhr.responseText))
								 }
							 }
							 xhr.send(null)
				}
			}
		})
			
	
	</script>
</html>
